<template>
  <div>
    <div class="list-btn">
      用户姓名:<Input v-model.trim="params.realname" placeholder="请输入姓名" style="width: 200px" clearable @keyup.enter.native="getList(url)" />
    </div>
    <div class="list-btn">
      手机号:<Input v-model.trim="params.phone" placeholder="请输入手机号" style="width: 200px" clearable @keyup.enter.native="getList(url)" />
    </div>
    <div class="list-btn">
      订单号:<Input v-model.trim="params.nid" placeholder="请输入订单号" style="width: 200px" clearable @keyup.enter.native="getList(url)" />
    </div>
    <div class="list-btn">
      结清状态:
      <Select clearable style="width:200px" v-model="params.settleStatus" placeholder="全部">
        <Option value=" ">全部</Option>
        <Option :value=0>未结清</Option>
        <Option :value=1>已结清</Option>
      </Select>
    </div>
    <!-- <div class="list-btn">
      催收状态:
      <Select clearable style="width:200px" v-model="params.allotStatus" placeholder="全部">
        <Option value=" ">全部</Option>
        <Option :value=0>催收中</Option>
        <Option :value=1>催收已回收</Option>
      </Select>
    </div> -->
    <div class="list-btn">
      时间:<DatePicker type="date" @on-change="startTime"  placeholder="选择开始时间" style="width: 200px" ></DatePicker>
      ～<DatePicker type="date" @on-change="endTime"  placeholder="选择结束时间" style="width: 200px"  ></DatePicker>
    </div>

    <div class="list-btn">
      <Button type="primary" @click="getList(url,'refresh')">搜索</Button>
    </div>
    <page-list :listTitle="listTitle" :list="list" :loading="loading" @selectItem="ids = $event;"></page-list>
    <page-button :current="params.pageCurrent"  :total="total" @changePageNum="params.pageCurrent = $event; getList(url)" @changePageSize="params.pageLimit = $event; getList(url)"></page-button>
    <Modal
      v-model="showModal.isLinkShow"
      title="用户信息"
      width="600px"
      :footer-hide="true"
      :loading="loading">
      <Tabs  v-model="linkTab" @on-click="change">
        <TabPane label="基本信息" name="name1">
          <Form :model="basicInfo" :label-width="90">
            <FormItem label="姓名" class="width30">
              <Input v-model="basicInfo.realname" disabled></Input>
            </FormItem>
            <FormItem label="手机号" class="width30">
              <Input v-model="phone" class="width60" disabled></Input>
              <Button class="width20" type="text" @click="openEditShow(basicInfo.phone)">查看</Button>
            </FormItem>
            <FormItem label="身份证号" style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="icard" disabled></Input>
            </FormItem>
          </Form>
          <Form :model="otherInfo" :label-width="90">
            <FormItem label="身份证地址"  style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="otherInfo.area1" disabled></Input>
            </FormItem>
            <FormItem label="居住地区"  style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="otherInfo.area" disabled></Input>
            </FormItem>
            <FormItem label="详细地址"  style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="otherInfo.address" disabled></Input>
            </FormItem>
            <FormItem label="单位名称"  style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="otherInfo.companyName" disabled></Input>
            </FormItem>
            <FormItem label="工作性质"  style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="otherInfo.workType" disabled></Input>
            </FormItem>
            <FormItem label="	单位地区"  style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="otherInfo.companyArea" disabled></Input>
            </FormItem>
            <FormItem label="单位详细地址"  style="display: block;width:80%;margin-bottom: 5px">
              <Input v-model="otherInfo.companyAddress" disabled></Input>
            </FormItem>
            <!--<FormItem label="月薪" class="width30">
              <Input v-model="otherInfo.monthly" disabled></Input>
            </FormItem>-->
          </Form>
          <Form :model="linkman" :label-width="90">
            <h3 class="title">常用联系人</h3>
            <FormItem label="姓名" class="width30">
              <Input v-model="linkman.contractName" disabled></Input>
            </FormItem>
            <FormItem label="姓名" class="width30">
              <Input v-model="linkman.contractNameOne" disabled></Input>
            </FormItem>
            <FormItem label="关系" class="width30">
              <Input v-model="linkman.relation" disabled></Input>
            </FormItem>
            <FormItem label="关系" class="width30">
              <Input v-model="linkman.relationOne" disabled></Input>
            </FormItem>
            <FormItem label="手机号" class="width30">
              <Input class="width60" v-model="contractMobile" disabled></Input>
              <Button type="text" class="width20" @click="openEditShow(linkman.contractMobile)">查看</Button>
            </FormItem>
            <FormItem label="手机号" class="width30">
              <Input class="width60" v-model="contractMobileOne" disabled></Input>
              <Button class="width20" type="text" @click="openEditShow(linkman.contractMobileOne)">查看</Button>
            </FormItem>
          </Form>
          <Form :model="bankCard" :label-width="90" class="form">
            <h3 class="title">绑定银行卡</h3>
            <FormItem label="银行卡名称"  style="display: inline-block;width:45%;margin-bottom: 5px">
              <Input v-model="bankCard.bankName" disabled></Input>
            </FormItem>
            <FormItem label="银行卡卡号" style="display: inline-block;width:45%;margin-bottom: 5px">
              <Input v-model="bankCard.bankNum" disabled></Input>
            </FormItem>
            <FormItem label="预留手机号" style="display: inline-block;width:45%;margin-bottom: 5px">
              <Input class="width60" v-model="bankPhone" disabled></Input>
              <Button class="width20" type="text" @click="openEditShow(bankCard.bankPhone)">查看</Button>

            </FormItem>
            <FormItem label="完成绑定时间" style="display: inline-block;width:45%;margin-bottom: 5px">
              <Input v-model="bankCard.createTime" disabled></Input>
            </FormItem>
          </Form>
        </TabPane>
<!--
        <TabPane label="淘宝收货地址" name="name4">
          <Table border :columns="taobaoTitle" :data="taobaoData"></Table>
          &lt;!&ndash;<Page style="margin-top: 10px;text-align: right;" :current="link.pageCurrent" :total="linkTotal" simple  @on-change="changeLinkNum"/>&ndash;&gt;
        </TabPane>-->
        <TabPane label="亲情号" name="name5">
          <Table border :columns="familyTitle" :data="familyData"></Table>
          <!--<Page style="margin-top: 10px;text-align: right;" :current="link.pageCurrent" :total="linkTotal" simple  @on-change="changeLinkNum"/>-->
        </TabPane>
        <TabPane label="通讯录" name="name2">
          <Table border :columns="linkTitle" :data="linkData"></Table>
          <Page style="margin-top: 10px;text-align: right;" :current="link.pageCurrent" :total="linkTotal" simple  @on-change="changeLinkNum"/>
        </TabPane>
        <TabPane label="通话记录" name="name3">
          <Table border :columns="recordTitle" :data="recordData"></Table>
          <Page style="margin-top: 10px;text-align: right;" :current="record.pageCurrent" :total="recordTotal" simple  @on-change="changeRecordNum"/>
        </TabPane>
      </Tabs>

      <div style="text-align: right;margin-top: 20px">
        <Button @click="showModal.isLinkShow = false;" type="primary">关闭</Button>
        <!--<Button type="primary" @click.prevent="UpdateData">确定</Button>-->
      </div>
    </Modal>
    <Modal
      v-model="showModal.rebackShow"
      title="客户反馈"
      :footer-hide="true"
      :loading="loading"
      width="600px">
      <Form style="">
        <Table height="400" :columns="rebackTitle" border :data="rebackData"></Table>
      </Form>
      <div style="text-align: right;margin-top: 20px">
        <Button @click="showModal.rebackShow = false;">关闭</Button>
        <!--<Button type="primary" @click.prevent="UpdateData">确定</Button>-->
      </div>
    </Modal>
    <Modal
      v-model="showModal.isOrderShow"
      title="订单流程"
      :footer-hide="true"
      :loading="loading"
      width="600px">
      <Form style="">
        <Table height="400" :columns="isOrderTitle" border :data="isOrderData"></Table>
      </Form>
      <div style="text-align: right;margin-top: 20px">
        <Button @click="showModal.isOrderShow = false;">关闭</Button>
        <!--<Button type="primary" @click.prevent="UpdateData">确定</Button>-->
      </div>
    </Modal>
    <Modal
      v-model="showModal.isShow"
      title="查看催收记录"
      :footer-hide="true"
      :loading="loading"
      width="600px">
      <Form style="">
        <Tabs v-model="linkTabS">
          <TabPane label="客户反馈" name="rebackL">
            <Table height="400" :columns="rebackTitle" border :data="rebackData"></Table>
          </TabPane>
          <TabPane label="订单流程" name="orderL">
            <Table height="400" :columns="isOrderTitle" border :data="isOrderData"></Table>
          </TabPane>
        </Tabs>
      </Form>
      <div style="text-align: right;margin-top: 20px">
        <Button @click="showModal.isShow = false;">关闭</Button>
        <!--<Button type="primary" @click.prevent="UpdateData">确定</Button>-->
      </div>
    </Modal>
    <Modal
      v-model="showModal.editShow"
      title="新增催收记录"
      :footer-hide="true"
      :mask-closable="false"
      :closable="false"
      :style="{textAlign:'left'}">
      <Form  :label-width="80" ref="formRole" :rules="ruleValidate" :model="formRole">
        <FormItem label="开始计时">
          <Input v-model="countTime" style="width:200px" disabled></Input> 秒
        </FormItem>
        <FormItem label="催收电话">
          <Input v-model="formRole.phone" style="width:200px" disabled></Input>
        </FormItem>
       <FormItem label="反馈类型" prop="remarkType" >
         <Select v-model="formRole.remarkType" style="width:200px">
            <Option value="0">接通</Option>
            <Option value="1">未接通</Option>
         </Select>
        </FormItem>
        <FormItem label="反馈内容" prop="remarkContent" >
         <Select v-model="formRole.remarkContent" style="width:200px" v-if="formRole.remarkType == 0">
           <Option v-for="(item,index) in passList" :key="index" :value="item.value" >{{item.name}}</Option>
         </Select>
         <Select v-model="formRole.remarkContent" style="width:200px" v-if="formRole.remarkType != 0">
           <Option v-for="(item,index) in failList" :key="index" :value="item.value" >{{item.name}}</Option>
         </Select>
        </FormItem>
        <FormItem label="备注" prop="remark" v-if="formRole.remarkContent == '8'">
          <Input v-model="formRole.remark" type="textarea"  :maxlength=200 :autosize="{ minRows: 4, maxRows: 8 }" placeholder="请输入" style="width:360px"></Input>
        </FormItem>
        <div style="text-align: right;margin-top: 20px">
          <!--<Button @click="showModal.editShow = false;resetValidate('formRole')" style="margin-right:5px">取消</Button>-->
          <Button type="primary" @click="ok">确定</Button>
        </div>
      </Form>
    </Modal>

  </div>
</template>

<script>
  import listMixin from '../../mixin/list'
  import pageList from '../../template/listTemplate'
  import pageButton from '../../template/pageBtnTemplate'
  import confirmDialog from '../../template/confirmDialogTemplate'
  export default {
    mixins:[listMixin],
    components: {
      pageList,
      pageButton,
      confirmDialog
    },
    methods:{
      openEditShow(value){
        this.showModal.editShow = true;
        this.formRole.phone=value;
        this.clearT();
        this.timedCount();
      },
      timedCount(){
        this.countTime=this.countTime+1;
        let self = this;
        this.clearTime=setInterval(function(){
          self.countTime++;
        },1000)
      },
      clearT(){
        this.countTime = 0;
        clearInterval(this.clearTime);
      },
      change(name){
        if(name == 'name3'){
          this.record.pageCurrent = 1;
          console.log(this.recordData,'this.recordData')
          this.getRecordMan(this.record.pageCurrent);
        }else if(name == 'name2'){
          this.link.pageCurrent = 1;
          this.getLinkMan(this.link.pageCurrent);
        }
      },
      initData(){
        this.linkTab = 'name1';
        this.linkTabS = 'rebackL';
        this.link.pageCurrent = 1;
        this.record.pageCurrent = 1;
      },
      changeRecordNum(value){
        this.record.pageCurrent = value;
        this.getRecordMan(this.record.pageCurrent);
      },
      getRecordMan(pageCurrent){
        this.$post('/bkmoxieyysorigincalls/list',{pageCurrent:pageCurrent,userId:this.user_id})
          .then((res) => {
            if(res.code === 0){
              this.recordData = res.data.pageListData;
              this.recordTotal = res.data.resultCount;
            }
          }, (err) => {
            console.log(err);
          })
      },
      changeLinkNum(value){
        this.link.pageCurrent = value;
        this.getLinkMan(this.link.pageCurrent);
      },
      getLinkMan(pageCurrent){
        this.$post('/bkuserlinkman/list',{pageCurrent:pageCurrent,userId:this.user_id})
          .then((res) => {
            if(res.code === 0){
              this.linkData = res.data.pageListData;
              this.linkTotal = res.data.resultCount;
            }
          }, (err) => {
            console.log(err);
          })
      },
      ok(){
         this.$refs['formRole'].validate((valid) => {

          if (valid) {
            this.$post('/bkcollectionlog/append',{
              collectionUserId:this.collectionUserId,
              remark:this.formRole.remark,
              collectionId:this.collectionId
           })
            .then((res) => {
              if(res.code === 0){
                this.showModal.editShow = false;
                this.resetValidate('formRole')
                this.$Message.success('提交成功！');
              }
            }, (err) => {
              console.log(err);
            })
            }
         })
      },
      getLink(id){
        this.$post('/user/customer/info',{
          id:id
        })
          .then((res) => {
            if(res.code === 0){
              const data = res.data;
              this.basicInfo.realname = data.realname; //基本信息
              this.basicInfo.phone = data.phone; //基本信息
              this.phone = this.handlePhone(data.phone);
              let idCard = data.detailMap.userIdc.idc ? data.detailMap.userIdc.idc : "";
              let xing = '';
              for(let i=0;i<idCard.length-4;i++){
                xing += '*';
              }
              this.icard = idCard? (xing + idCard.substr(idCard.length-4)):'';
              this.basicInfo.idc = data.detailMap.userIdc.idc ? data.detailMap.userIdc.idc : "";
              this.basicInfo.idcFrontImg = data.detailMap.userIdc.idcFrontImg ? data.detailMap.userIdc.idcFrontImg : "";
              this.basicInfo.idcBacImg = data.detailMap.userIdc.idcBacImg ? data.detailMap.userIdc.idcBacImg : "";

              this.otherInfo = data.detailMap.userBasice; //其他信息
              this.otherInfo.workType = this.getType(this.otherInfo.workType,'work');

              this.linkman = data.detailMap.userBasice; //联系人
              this.linkman.relation = this.getType(this.linkman.relation,'relation');
              this.linkman.relationOne = this.getType(this.linkman.relationOne,'relation');
              this.contractMobile = this.handlePhone(this.linkman.contractMobile);
              this.contractMobileOne = this.handlePhone(this.linkman.contractMobileOne);

              this.bankCard = data.detailMap.userBankList[0] ? data.detailMap.userBankList[0] : {};
              let bankNum = this.bankCard.bankNum;
              this.bankPhone = this.handlePhone(this.bankCard.bankPhone);
              let bankCardXing = '';
              for(let i=0;i<bankNum.length-4;i++){
                bankCardXing += '*';
              }

              this.bankCard.bankNum = bankCardXing + bankNum.substr(bankNum.length-4);//银行卡
              this.bankCard.createTime = this.bankCard.createTime ? this.getLocalTime(this.bankCard.createTime) : '';

            }
          }, (err) => {
            console.log(err);
          })
      },
      getCollectionLog(id){
        this.$post('/bkcollectionlog/list',{
          collectionId:id
        })
          .then((res) => {
            if(res.code === 0){
              this.CollectionLog = res.data;
            }
          }, (err) => {
            console.log(err);
          })
      },
      getType(num,type) {
        let obj = {};
        if(type == 'relation'){
          obj = { //联系人关系
            "1": "父母",
            "2": "配偶",
            "3": "兄弟",
            "4": "姐妹",
            "5": "朋友"
          }
        }else if(type == 'work'){//"打工", "个体户", "体制内工作", "老板", "无业"
          obj = { //公司性质
            "1": "打工",
            "2": "个体户",
            "3": "体制内工作",
            "4": "老板",
            "5": "无业",
          }
        }
        for (let key in obj) {
          if (key == num) {
            return obj[key];
            break;
          }
        }
      },
    },
    data () {
      return {
        bankPhone:'',
        isOrderTitle:[
          {
            title:'时间',
            key:'',
            width:140,
            align:'center'
          },
          {
            title:'操作内容',
            key:'',
            align:'left'
          }
        ],
        isOrderData:[],
        rebackTitle:[
          {
            title:'时间',
            key:'',
            minWidth:50,
            align:'center'
          },
          {
            title:'当前催收人员',
            key:'',
            minWidth:50,
            align:'center'
          },
          {
            title:'催收手机号',
            key:'',
            minWidth:50,
            align:'center'
          },
          {
            title:'催收反馈类型',
            key:'',
            minWidth:50,
            align:'center'
          },
          {
            title:'催收内容',
            key:'',
            minWidth:50,
            align:'center'
          },
          {
            title:'通话次数',
            key:'',
            minWidth:50,
            align:'center'
          },
          {
            title:'通话时长',
            key:'',
            minWidth:50,
            align:'center'
          }
        ],
        rebackData:[],
        phone:'',
        countTime:0,
        clearTime:'',
        linkTab:'',
        linkTabS:'',
        recordDataHas:false,
        linkDataHas:false,
        recordTotal:0,
        linkTotal:0,
        user_id:'',
        contractMobileOne:'',
        contractMobile:'',
        icard:'',
        taobaoTitle:[
          {
            title:'收货人姓名',
            key:'name',
            minWidth:50,
          },
          {
            title:'使用次数',
            key:'count',
            minWidth:40,
            align:'center'

          },
          {
            title:'手机号',
            key:'phone',
            minWidth:40,
            align:'center'

          },
          {
            title:'收货地址',
            key:'address',
            minWidth:80
          },

        ],
        taobaoData:[
          {
            name:'小仙女慧慧',
            count:10,
            phone:'13389078908',
            address:'浙江省杭州市余杭区福鼎家园19幢1单元501'
          },
          {
            name:'小美女慧慧',
            count:10,
            phone:'13389078908',
            address:'浙江省杭州市西湖区余杭塘路与崇信路交叉口蒋村西溪人家5-1508'
          }
        ],
        familyTitle:[
          {
            title:'亲情号',
            minWidth:50,
            key:'familyNumber',
            align:'center'
          },
          {
            title:'手机号',
            key:'phone',
            minWidth:50,
            align:'center',
            render: (h,params) => {
              return h('div', this.handlePhone(params.row.phone))
            }
          },
          {
            title:'关系',
            key:'connect',
            minWidth:50,
            align:'center'
          },
          {
            title:'操作',
            key:'action',
            minWidth:50,
            align:'center',
            render: (h,params) => {
              return h('div',[
                h('Button',{
                  props: {
                    type: 'info',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      this.openEditShow(params.row.phone);
                    }
                  }
                },'查看')
              ])
            }
          }
        ],
        familyData:[
          {
            familyNumber:123,
            phone:'18079808908',
            connect:'伴侣'
          }
        ],
        link: {
          //status:'',
          pageCurrent: 1,
          pageLimit: 10
        },
        record: {
          //status:'',
          pageCurrent: 1,
          pageLimit: 10
        },
        passList:[
          {value:'0',name:'挂断'},
          {value:'1',name:'拒绝还款'},
          {value:'2',name:'有还款意向'},
          {value:'3',name:'无偿还能力'},
          {value:'4',name:'承诺还款'},
          {value:'5',name:'愿意转告'},
          {value:'6',name:'愿意代偿'},
          {value:'7',name:'投诉意见'},
          {value:'8',name:'其他'},
        ],
         failList:[
          {value:'0',name:'未接'},
          {value:'1',name:'拒接'},
          {value:'2',name:'停机'},
          {value:'3',name:'关机'},
          {value:'4',name:'空号'},
          {value:'5',name:'忙线中'}
        ],
        tag: {
          'title': '我的催收',
          'path': '/work/urgeMine/list'
        },
        formRole:{},
        collectionId:'',
        collectionUserId:'',
        CollectionLog:[],
        showModal:{
          isShow:false,
          editShow:false,
          isLinkShow:false,
          rebackShow:false,
          isOrderShow:false,
        },
        linkman: {},
        basicInfo: {},
        otherInfo: {},
        bankCard: {},
        ruleValidate: {
          remarkType: [
            { required: true, message: '请选择反馈类型', trigger: 'blur' }
          ],
          remarkContent: [
            { required: true, message: '请选择反馈内容', trigger: 'blur' }
          ],
          remark: [
            { required: true, message: '请填写备注', trigger: 'blur' }
          ],
        },
        linkTitle:[
          {
            title:'姓名',
            key:'name'
          },
          {
            title:'手机号',
            key:'mobile',
            render: (h,params) => {
              return h('div', this.handlePhone(params.row.mobile))
            }
          },
          {
            title:'操作',
            key:'action',
            minWidth:50,
            align:'center',
            render: (h,params) => {
              return h('div',[
                h('Button',{
                  props: {
                    type: 'info',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      this.openEditShow(params.row.mobile);
                    }
                  }
                },'查看')
              ])
            }
          }
        ],
        linkData:[],
        recordData:[],
        recordTitle:[

          {
            title:'姓名',
            key:'name',
            minWidth:30,
            render: (h,params) =>{
              return h('div',params.row.name ? params.row.name : '未知')
            }
          },
          {
            title:'手机号',
            key:'peerNumber',
            minWidth:30,
            render: (h,params) => {
              return h('div', this.handlePhone(params.row.peerNumber))
            }
          },
          {
            title:'通话时长(s)',
            key:'duration',
            minWidth:20
          },
          {
            title:'通话次数',
            key:'callCount',
            minWidth:20
          },
          {
            title:'最近一次通话时间',
            key:'billMonth',
            minWidth:50
          },
          {
            title:'操作',
            key:'action',
            minWidth:50,
            align:'center',
            render: (h,params) => {
              return h('div',[
                h('Button',{
                  props: {
                    type: 'info',
                    size: 'small'
                  },
                  style: {
                    marginRight: '5px'
                  },
                  on: {
                    click: () => {
                      this.openEditShow(params.row.peerNumber);
                    }
                  }
                },'查看')
              ])
            }
          }
        ],
        statusList:[
          {
            id: 0,
            name:'未分配'
          },
          {
            id: 1,
            name: '已分配'
          }
        ],
        CollectionLogTitle:[
          {
            title: '时间',
            align:'center',
            width:150,
            key:'createTime',
            render: (h, params) => {
              return h('div',this.getLocalTime(params.row.createTime))
            }
          },
          {
            title: '催收人员',
            align:'left',
            key:'remark',
          },
          {
            title: '反馈类型',
            align:'left',
            key:'remark',
          },
          {
            title: '反馈内容',
            align:'left',
            key:'remark',
          },
          {
            title: '备注',
            align:'left',
            key:'remark',
          },
        ],
        listTitle: [
          {
            title: '订单号',
            minWidth: 140,
            key: 'nid',
            align:'left',
          },
          {
            title: '用户姓名',
            key: 'realname',
            minWidth:90,
            align:'center'
          },
          {
            title: '手机号',
            key: 'phone',
            minWidth:100,
            align:'center',
            render: (h, params) => {
              let phone = params.row.phone;
              return h('div', phone?`${phone.substr(0,3)}****${phone.substr(7)}`:'—')
            }
          },/*
          {
            title: '借款周期(天)',
            key: 'loanDay',
            minWidth:80,
            align:'center'
          },*/
          {
            title: '借款信息',
            key: 'loanMoney',
            minWidth:100,
            align:'center',
            render: (h, params) => {
              return h('div', `${this.toYuan(params.row.loanMoney)} (${params.row.loanDay}天)`)
            }
          },
          /*{
            title: '应还金额(元)',
            key: 'deptNeedRepayment',
            minWidth:80,
            align:'center',
            render: (h, params) => {
              return h('div', this.toYuan(params.row.deptNeedRepayment))
            }
          },*/
         /* {
            title: '应还本金(元)',
            key: 'realMoney',
            minWidth:110,
            align:'center',
            render: (h, params) => {
              return h('div', this.toYuan(params.row.realMoney))
            }
          },*/
          {
            title: '逾期费用(元)',
            key: 'deptOverdueAmount',
            minWidth:80,
            align:'center',
            render: (h, params) => {
              return h('div', this.toYuan(params.row.deptOverdueAmount))
            }
          },
          {
            title: '已还金额(元)',
            key: 'deptRepaymentMoney',
            minWidth:80,
            align:'center',
            render: (h, params) => {
              return h('div', this.toYuan(params.row.deptRepaymentMoney))
            }
          },
          {
            title: '逾期天数',
            key: 'deptDays',
            minWidth:80,
            align:'center'
          },/*
          {
            title: '催回金额(元)',
            key: 'collectionMoney',
            minWidth:80,
            align:'center',
            render: (h, params) => {
              return h('div', this.toYuan(params.row.collectionMoney))
            }
          },*/
          {
            title: '合同开始时间',
            key: 'borrowTime',
            minWidth:160,
            align:'center',
            render: (h, params) => {
              return h('div',this.getLocalTime(params.row.borrowTime))
            }
          },
         /* {
            title: '合同结束时间',
            key: 'repayTime',
            minWidth:160,
            align:'center',
            render: (h, params) => {
              return h('div',this.getLocalTime(params.row.repayTime))
            }
          },*/
          {
            title: '结清状态',
            key: 'settleStatus',
            minWidth:80,
            align:'center',
            render: (h, params) => {// 审核状态 0审核中，1通过，2拒绝 ，3电核
              let d = {};
              switch (params.row.settleStatus){
                case 0:
                  d.txt = '未结清';
                  d.color = '#f90';
                  break;
                case 1:
                  d.txt = '已结清';
                  d.color = '#19be6b';
                  break;

              }
              return h('div', {
                props: {},
                style:{
                  color:d.color
                }
              }, d.txt)
            },
          },
          // {
          //   title: '催收状态',
          //   key: 'allotStatus',
          //   minWidth:90,
          //   align:'center',
          //   render: (h, params) => {// 审核状态 0审核中，1通过，2拒绝 ，3电核
          //     let d = {};
          //     switch (params.row.allotStatus){
          //       case 0:
          //         d.txt = `${params.row.collectionUserName}:催收中`;
          //         break;
          //       case 1:
          //         d.txt = '已回收';
          //         break;

          //     }
          //     switch (params.row.settleStatus){
          //       case 0:
          //         d.color = '#f90';
          //         break;
          //       case 1:
          //         d.color = '#19be6b';
          //         break;

          //     }
          //     return h('div', {
          //       props: {},
          //       style:{
          //         color:d.color
          //       }
          //     }, d.txt)
          //   },
          // },
          {
            title: '操作',
            key: 'action',
            align:'center',
            width: 260,
            render: (h, params) => {
              //if(params.row.allotStatus != 1){
                return h('div', [
                  h('Button', {
                    props: {
                      type: 'info',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.initData();
                        this.showModal.isLinkShow = true;
                        this.user_id = params.row.userId;
                        this.getLink(params.row.userId);
                        // this.getRecordMan(1);
                        // this.getLinkMan(1);
                      }
                    }
                  }, '查看用户详情'),
                  h('Button',{
                    props: {
                      type: 'info',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.showModal.rebackShow = true;
                        //this.getCollectionLog(params.row.id);
                      }
                    }
                  },'客户反馈'),
                  h('Button',{
                    props: {
                      type: 'info',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.showModal.isOrderShow = true;
                        //this.getCollectionLog(params.row.id);
                      }
                    }
                  },'订单流程')
/*
                  h('Button', {
                    props: {
                      type: 'info',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.showModal.editShow = true;
                        this.resetValidate('formRole');
                        this.formRole={remarkType:'0',remarkContent:'0'};
                        this.collectionUserId = params.row.collectionUserId;
                        this.collectionId = params.row.id;
                      }
                    }
                  }, '新增催记'),*/

                ]);
              /*}else{
                return h('div', [
                  h('Button',{
                    props: {
                      type: 'info',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.showModal.rebackShow = true;
                        //this.getCollectionLog(params.row.id);
                      }
                    }
                  },'客户反馈'),
                  h('Button',{
                    props: {
                      type: 'info',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.showModal.isOrderShow = true;
                        //this.getCollectionLog(params.row.id);
                      }
                    }
                  },'订单流程')
                ]);

              }
*/
            }
          },
        ],
        url: '/bkcollection/person/list',
        nameListUrl: '',
        params: {
          //status:'',
          pageCurrent: 1,
          pageLimit: 10
        },

      }
    },
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .list-btn{
    margin-bottom: 5px;
    margin-right: 5px;
    display: inline-block;
  }
  .refresh-btn{
    float: right;
  }
  .width30 {
    width: 40%;
    display: inline-block;
    margin-bottom: 5px;
  }
  .width20 {
    width: 30%;
    display: inline-block;
    margin-bottom: 5px;
  }
  .width60 {
    width: 60%;
    display: inline-block;
    margin-bottom: 5px;
  }
  /deep/ .ivu-table-cell{
    padding-left: 5px;
    padding-right: 5px;
  }
</style>
